<template>
    <div class="console view-body">
      <div class="btn-item">
        逾期数据BTN
        <select name="" id="" v-model="overdueDataType">
          <option value="1">类型</option>
          <option value="2">户数</option>
        </select>
        <select name="" id="" v-model="overdueDataTime">
          <option value="1">日</option>
          <option value="2">周</option>
          <option value="3">月</option>
        </select>
      </div>
      <div class="btn-item">
        实收数据BTN
        <select name="" id="" v-model="paidInDataType">
          <option value="1">类型</option>
          <option value="2">户数</option>
        </select>
        <select name="" id="" v-model="paidInDataTime">
          <option value="1">日</option>
          <option value="2">周</option>
          <option value="3">月</option>
        </select>
      </div>
      <div class="btn-item">
        实收数据BTN
        <select name="" id="" v-model="accountReceiveDataType">
          <option value="1">类型</option>
          <option value="2">户数</option>
        </select>
        <select name="" id="" v-model="accountReceiveDataTime">
          <option value="1">日</option>
          <option value="2">周</option>
          <option value="3">月</option>
        </select>
      </div>
      <hr>
      <h1>主页信息{{consoleStatus}}</h1>
      <hr>
      <h1>overdueData{{overdueData}}</h1>
      <hr>
      <h1>paidInData{{paidInData}}</h1>
      <hr>
      <h1>accountReceiveData{{accountReceiveData}}</h1>
    </div>
</template>

<script>
  import axios from 'axios'
  import {getStorage} from "../../common/js/localStorage";
  import global from '../global'
  export default {
      name: "console",
      data(){
        return {
          consoleStatus:[],         //主页信息
          overdueData:[],           //逾期数据
          overdueDataType:1,        //逾期数据Type
          overdueDataTime:1,        //逾期数据Time
          paidInData:[],            //实收数据
          paidInDataType:1,         //实收数据type
          paidInDataTime:1,         //实收数据Time
          accountReceiveData:[],    //应收数据
          accountReceiveDataType:1, //应收数据Type
          accountReceiveDataTime:1, //应收数据Time
        }
      },
      created(){
        //进入调用获得页面主题信息方法
        this._getConsoleMsg()
        this._getOverdueData()
        this._getPaidInData()
        this._getAccountReceiveData()
      },
      methods:{
        /*@props
         * 获取控制台信息
         */
        _getConsoleMsg(){
          let _this = this
          axios.get('http://'+global.$host+'/homePage/homePageData',
            {
              headers: {
                'Authorization': getStorage('Authorization')
              }
            }
          )
            .then(res => {
              if(res.status===global.ERR_OK){
                if(res.data.status===global.CUSTOM_ERR_OK){
                  let data = res.data.data
                  _this.consoleStatus = data;
                }
                // console.log(res)
              }else {
                return
              }
            })
            .catch(e => {
              console.log(e)
            })
        },
        
        /*@props
         * 获得逾期数据
         */
        _getOverdueData(){
          let _this = this
          axios.get('http://'+global.$host+'/homePage/getOverdueData?type='+_this.overdueDataType+'&time='+_this.overdueDataTime,
            {
              headers: {
                'Authorization': getStorage('Authorization')
              }
            }
          )
            .then(res => {
              if(res.status===global.ERR_OK){
                if(res.data.status===global.CUSTOM_ERR_OK){
                  let data = res.data.data
                  _this.overdueData = data;
                }
              }else {
                return
              }
            })
            .catch(e => {
              console.log(e)
            })
        },
        /*@props
         * 获得实收数据
         */
        _getPaidInData(){
          let _this = this
          axios.get('http://'+global.$host+'/homePage/getPaidInData?type='+_this.paidInDataType+'&time='+_this.paidInDataType,
            {
              headers: {
                'Authorization': getStorage('Authorization')
              }
            }
          )
            .then(res => {
              if(res.status===global.ERR_OK){
                if(res.data.status===global.CUSTOM_ERR_OK){
                  let data = res.data.data
                  _this.paidInData = data;
                }
              }else {
                return
              }
            })
            .catch(e => {
              console.log(e)
            })
        },
        /*@props
         * 获得应收数据
         */
        _getAccountReceiveData(){
          var _this = this
          axios.get('http://'+global.$host+'/homePage/getAccountReceiveData?type='+_this.accountReceiveDataType+'&time='+_this.accountReceiveDataTime,
            {
              headers: {
                'Authorization': getStorage('Authorization')
              }
            }
          )
            .then(res => {
              if(res.status===global.ERR_OK){
                if(res.data.status===global.CUSTOM_ERR_OK){
                  let data = res.data.data
                  _this.accountReceiveData = data;
                }
              }else {
                return
              }
            })
            .catch(e => {
              console.log(e)
            })
        }
      },
      mounted(){
        // console.log(this.consoleStatus)
      },
      watch:{
        //监控数据参数变化调用请求数据方法渲染页面
        'overdueDataType'(){
          this._getOverdueData()
        },
        'overdueDataTime'(){
          this._getOverdueData()
        },
        'paidInDataType'(){
          this._getPaidInData()
        },
        'paidInDataTime'(){
          this._getPaidInData()
        },
        'accountReceiveDataType'(){
          this._getAccountReceiveData()
        },
        'accountReceiveDataTime'(){
          this._getAccountReceiveData()
        },
      }
    }
</script>

<style scoped>

</style>
